<template>
  <div>
    <el-dialog
      :title="obj.isadd?'管理员添加':'管理员编辑'"
      :visible.sync="obj.istrue"
      width="50%"
      :before-close="handleClose"
    >
      <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="所属角色">
          <el-select v-model="form.roleid" placeholder="请选择所属角色">
            <el-option
              v-for="item in rolelist"
              :key="item.id"
              :label="item.rolename"
              v-model="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="用户名">
          <el-input v-model="form.username"></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input v-model="form.password"></el-input>
        </el-form-item>
        <el-form-item label="状态">
          <el-switch
            v-model="form.status"
            :active-value="1"
            :inactive-value="2"
          ></el-switch>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="quxiao()">取 消</el-button>
        <el-button type="primary" @click="add()" v-if='obj.isadd'>添 加</el-button>
        <el-button type="primary" @click="bianji()" v-else>编 辑</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { mapActions, mapGetters } from "vuex";
import {useradd,userinfo,useredit} from '../../../request/api';
import {successAlert,warningAlert} from '../../../util/alert'
export default {
  props: ["obj"],
  data() {
    return {
      dialogVisible: true,
      form: {
        roleid: "",
        username: "",
        password: "",
        status: 1,
      },
    };
  },
  methods: {
    ...mapActions({
      reqrolelist: "role/reqchangelist",
      reqmanegelist:'manege/reqchangelist',
      reqmanegecount:'manege/reqchangecount'
    }),
    // 点击弹窗x执行的回调函数
    handleClose() {
      this.quxiao();
    },
    // 清空数据
    empty() {
      this.form = {
        roleid: "",
        username: "",
        password: "",
        status: 1,
      };
    },
    // 点击取消
    quxiao() {
      // 取消弹窗
      this.obj.istrue = false;
      //   清空内容
      this.empty();
    },
    // 点击添加
    add() {
      // console.log(this.form);
      useradd(this.form).then(res=>{
          if(res.data.code==200){
                successAlert(res.data.msg)
                // 关闭弹框清空内容
                this.quxiao()
                // 刷新列表
                this.reqmanegelist()
                // 刷新总个数
                this.reqmanegecount()
            }else{
                warningAlert(res.data.msg)
            }
      })
    },
    // 获取一条信息
    getinfo(uid){
      
      userinfo({uid:uid}).then(res=>{
        // console.log(res);        
        this.form=res.data.list
        this.form.password=''
      })
      // this.obj.istrue=true
    },
    // 点击编辑
    bianji(){
      // console.log(this.form);
      useredit(this.form).then(res=>{
        if(res.data.code==200){
                successAlert(res.data.msg)
                // 关闭弹框清空内容
                this.quxiao()
                // 刷新列表
                this.reqmanegelist()
            }else{
                warningAlert(res.data.msg)
            }
      })
    }
  },
  computed: {
    ...mapGetters({
      rolelist: "role/list",
      manegelist:'manege/list',
      manegecount:'manege/count'
    }),
  },
  mounted() {
    this.reqrolelist();
  },
};
</script>

<style lang="less" scoped>
</style>